<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>文件移动模仿</title>
		<script src="js/jquery-1.11.0.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/jquery-migrate-1.4.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script src="js/rgb2hex.js" type="text/javascript" charset="utf-8"></script>
		<style type="text/css">
		     .files_score{
		     	height:150px ;
		     	width: 150px;
		     	border:1px solid blueviolet ;
		     	float: left;
		     }
			.options{
				height:auto;
		     	width: 3em;
		     	float: left;
			}
			span{
				display: block;
				background: red;
			}
			.clear{
				clear: both;
			}
		</style>
	</head>
	<body>
		<div class="files_score file_area1">
			<span data-id="first"><a href="javascript:void(0)">第一个项目</a></span>
			<span data-id="second"><a href="#">第二个项目</a></span>
			<span data-id="third"><a href="#">第三个项目</a></span>
		</div>
		<div class="options">
			<button type="button">&gt;</button>
			<button type="button">&gt;&gt;</button>
			<button type="button">&gt;&gt;&gt;</button>
			<button type="button">&lt;</button>
			<button type="button">&lt;&lt;</button>
			<button type="button">&lt;&lt;&lt;</button>
		</div>
		<div class="files_score file_area2">
			
		</div>
		<div class="clear"></div>
	</body>
	<script>
		$(document).ready(function(){
			console.info(document.querySelector('span[data-id="first"]'));
			$('[data-id="first"]').bind('click',function(event){
				console.info("afaadsf");
				$(this).background;
				console.info($(this));
//				var bg = this.background.value;
//				if( bg == '#ffffff'){
//					this.css('background','ff0000');
//				}else if(bg == '#ff0000'){
//					this.css('background','ffffff');
//				}
			});
		});
	</script>
</html>
